아이템21

타입 넓히기

• 변수는 가능한 값들의 집합인 타입을 가진다.
• 지정된 값을 가지고 할당 가능한 집합 유추를 넓히기라 부른다.

interface Vector3 {
  x: number;
  y: number;
  z: number;
}
function getComponent(vector: Vector3, axis: "x" | "y" | "z") {
  return vector[axis];
}

let x = "x";
let vec = { x: 10, y: 20, z: 30 };
getComponent(vec, x); // 문제가 발생한다.

• x의 타입이 넓히기로 의해 string으로 추론되어 에러가 발생한다.

넓히기 과정 제어하는 방법

• const사용

interface Vector3 {
  x: number;
  y: number;
  z: number;
}
function getComponent(vector: Vector3, axis: "x" | "y" | "z") {
  return vector[axis];
}

const x = "x";
let vec = { x: 10, y: 20, z: 30 };
getComponent(vec, x); // 문제가 발생한다.

• 다만 const도 객체나 배열의 경우 문제가 발생한다.
• 객체는 선언시 모양을 기준으로 추론되기 때문에, 한번에 만들어야 한다.

해결법

• 명시적 타입 구문

const v: { x: 1 | 3 | 5 } = {
  x: 1,
}; // 타입이 { x: 1|3|5 }

• 타입 체커에 추가적인 문맥 제공

• 단언문

const v1 = {
  x: 1,
  y: 2,
}; // { x: number; y: number; }

const v2 = {
  x: 1 as const,
  y: 2,
}; // { x: 1; y: number; }

const v3 = {
  x: 1,
  y: 2,
} as const; // { readonly x: 1; redaonly y: 2; }